@import "../theme/light";
@import "../theme/variables";

@filter-height: 32px;
.file-panel {
  position: absolute;
  top: -1px;
  left: @server-panel-width;
  bottom: 0;
  width: @file-panel-width;
  background-color: @body-background;
  overflow: hidden;
  z-index: 1;

  .filter {
    position: absolute;
    top: 0;
    left: 0;
    height: @filter-height;
    width: @file-panel-width;
    border-bottom: @border-default;
    display: flex;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    .ivu-btn {
      height: 32px;
      border-left: none;
      border-right: none;

      &:hover {
        border-top: @border-default;
        border-bottom: @border-default;
      }
    }

    .ivu-input {
      height: @filter-height;
    }

    .ivu-input-suffix {
      line-height: @filter-height;
    }

    .ivu-input-icon-clear {
      line-height: @filter-height;
      cursor: pointer;
    }
  }

  .file-list {
    position: absolute;
    top: @filter-height;
    left: 0;
    bottom: 0;
    width: @file-panel-width;
    border-right: @border-default;
    padding-bottom: @menu-height;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    @file-item-height: 40px;
    .file-item {
      height: @file-item-height;
      line-height: @file-item-height;
      font-size: 12px;
      padding: 0 24px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      cursor: pointer;

      &.active {
        background: #f0faff;
        color: @primary-color;
        border-right: 1px solid @primary-color;
      }

      &:hover {
        color: @primary-color;
      }
    }
  }

  .menu {
    position: absolute;
    left: 0;
    bottom: 0;
    height: @menu-height;
    width: @file-panel-width;
    border-right: @border-default;
    padding-top: 2px;
    text-align: center;
    z-index: 1;
  }
}
